﻿@*
    For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860
*@
@{
    Layout = null;
}
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <script type="text/javascript" src="//api.map.baidu.com/api?type=webgl&v=1.0&ak=E6fLfoZvafshmZ0srkPPo9Iu2f8xOZHa"></script>
    <script src="~/libs/jquery/jquery.js"></script>
    <title>本地搜索的结果面板</title>
    <style type="text/css">
        body, html {
            width: 100%;
            height: 100%;
            margin: 0;
            font-family: "微软雅黑";
        }

        #l-map {
            height: 700px;
            width: 900px;
        }

        #r-result {
            width: 300px;
            height: 700px;
        }
    </style>
</head>
<body>
    <table>
        <tr>
            <td>
                请输入地点：
                <input type="text" id="txtSite" size="30" value="" style="width:300px;" />
                <input type="button" value="查询" id="search" />
                <div id="r-result"></div>
            </td>
            <td> <div id="l-map" ></div></td>
        </tr>
    </table>

</body>
</html>
<script type="text/javascript">

    $(function () {
        setmap('');
        $("#search").click(function () {
            var site = document.getElementById("txtSite").value;
            setmap(site);
        });
    });

    function setmap(site) {

        if (site == "") {
            site = '';
        }

        // 百度地图API功能
        var map = new BMapGL.Map("l-map");            // 创建Map实例
        map.centerAndZoom(new BMapGL.Point(116.404, 39.915), 11);
        var local = new BMapGL.LocalSearch(map, {
            renderOptions: { map: map, panel: "r-result" }
        });
        local.search(site);
    }
  
</script>